<template>
  <div>
    <el-form :inline="true">
      <el-form-item>
        <el-select v-model="searchDto.provinceCode" v-if="tab === 0" clearable placeholder="请选择省份"
                   style="width:150px;">
          <el-option
            v-for="item in allSelectProvince"
            :key="item.code"
            :label="item.name"
            :value="item.code">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-input style="width:180px;" clearable placeholder="返厂批次号" v-model="searchDto.batch"></el-input>
      </el-form-item>
      <el-form-item>
        <el-input placeholder="快递单号" v-model="searchDto.logisticsNumber" v-if="tab === 0"></el-input>
      </el-form-item>
      <el-form-item>
        <el-select style="width:160px;" v-model="searchDto.logisticsCompany" v-if="tab === 0" clearable
                   placeholder="请选择快递公司">
          <el-option
            v-for="item in allLogisticsCompany"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item size="5">
        <el-input placeholder="SN" v-model="searchDto.ystsn" v-if="tab === 0 || tab === 2"></el-input>
      </el-form-item>
      <el-form-item>
        <el-date-picker
          v-model="searchDto.repairTime"
          v-if="tab === 1"
          type="daterange"
          value-format="yyyy-MM-dd"
          range-separator="至"
          start-placeholder="请选择维修日期开始"
          end-placeholder="请选择维修日期结束"
          align="right">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="searchData()">查询</el-button>
      </el-form-item>
      <!--维修模板下载，导入-->
      <el-form-item v-if="this.preRoleType == '4'">
        <el-dropdown @command="handleCommand">
          <el-button type="primary">导入<i
            class="el-icon-arrow-down el-icon--right"></i>
          </el-button>
          <el-dropdown-menu slot="dropdown">
            <!--没选中，则直接前台导出模板-->
            <a v-if="this.selectionList.length === 0" href="/static/工厂批量维修导入模板.xlsx"
               download="工厂批量维修导入模板.xlsx"
               style="color:#5a5e66;text-decoration: none ">
              <el-dropdown-item command="handleDownload">批量维修模板下载
              </el-dropdown-item>
            </a>
            <!--选中维修记录，则从后台导出模板-->
            <el-dropdown-item v-if="this.selectionList.length > 0" command="handleComplete">批量维修完整模板下载
            </el-dropdown-item>
            <el-dropdown-item command="handleImport">批量维修模板导入</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </el-form-item>

      <!--批量维修模板导入模态框-->
      <el-dialog title="模板导入" :visible.sync="uploadVisible"
                 :close-on-click-modal="false">
        <div>
          <el-form label-width="80px" ref="uploadForm" :inline="true">
            <el-form-item style="padding-left: 120px">
              <el-upload
                class="upload-demo"
                :action="uploadUrl"
                :headers="myHeaders"
                name="file"
                :on-error="uploadError"
                :on-success="uploadSuccess"
                :before-upload="beforeAvatarUpload"
                multiple
                drag
                :limit="1"
                :file-list="fileList">
                <i class="el-icon-upload"></i>
                <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em><br/>只能上传xlsx文件，且不超过10M</div>
              </el-upload>
            </el-form-item>
            <!--显示导入中错误的数据-->
            <div style="height: 200px;overflow-y: auto" v-if="hideTable">
              <custom-table
                :data="wrongDataList"
                :columns="uploadErrorColumns"
                :maxHeight="200">
              </custom-table>
            </div>
          </el-form>
        </div>
        <div slot="footer">
          <el-button type="primary" v-if="this.importBtnFlag === true" @click="uploadCancel()">确定</el-button>
        </div>
        <div slot="footer">
          <el-button type="warning" v-if="this.importBtnFlag === false" disabled>文件解析中，请勿关闭窗口</el-button>
        </div>
      </el-dialog>
      <!--已维修数据导出-->
      <el-form-item>
        <el-button type="primary" :loading="finishExportLoading" v-if="tab === 1" @click="excelExport()">数据导出
        </el-button>
      </el-form-item>
      <!--待维修数据导出-->
      <el-form-item>
        <el-button type="primary" :loading="unExportLoading" v-if="tab === 0" @click="excelExport1()">数据导出</el-button>
      </el-form-item>
    </el-form>
    <!-- 已接收批次列表 -->
    <!--<custom-table-->
    <!--:data="acceptWorkOrderList"-->
    <!--:columns="columns"-->
    <!--:tableLoadingFlag="tableLoadingFlag"-->
    <!--:operationColumn="operationColumn"-->
    <!--:pagination="pagination">-->
    <!--</custom-table>-->

    <!--<el-dialog title="批次机器明细" :visible.sync="detailDialogVisible" :close-on-click-modal="false">-->
    <!--&lt;!&ndash; 批次内机器详细列表 &ndash;&gt;-->
    <!--<custom-table-->
    <!--:data="detailList"-->
    <!--:columns="detailColumns"-->
    <!--:tableLoadingFlag="detailTableLoadingFlag"-->
    <!--:operationColumn="detailOperationColumn"-->
    <!--:pagination="pagination1">-->
    <!--</custom-table>-->
    <!--<div slot="footer">-->
    <!--<el-button type="primary" @click="onBtnCancel()">取消</el-button>-->
    <!--</div>-->
    <!--</el-dialog>-->
    <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick(activeName)">
      <el-tab-pane label="待维修" name="unRepair">
        <custom-table
          :multipleSelection="this.preRoleType == '4'"
          :data="acceptWorkOrderList"
          :columns="columns"
          :tableLoadingFlag="tableLoadingFlag"
          :operationColumn="operationColumn"
          :pagination="pagination"
          @selection-change="selectionChange">
        </custom-table>
      </el-tab-pane>
      <el-tab-pane label="报废中" name="scraping">
        <custom-table
          :data="scrapingList"
          :columns="scrapingColumns"
          :tableLoadingFlag="scrapingLoadingFlag"
          :operationColumn="scrapingOperationColumn"
          :pagination="pagination2">
        </custom-table>
      </el-tab-pane>
      <el-tab-pane label="已维修" name="alreadyRepair">
        <custom-table
          :data="accepFinishtWorkOrderList"
          :columns="finishColumns"
          :tableLoadingFlag="finishTableLoadingFlag"
          :pagination="pagination1">
        </custom-table>
      </el-tab-pane>
    </el-tabs>
    <!--报废中工单补充报废附件-->
    <el-dialog title="上传报废附件" :visible.sync="scrapingVisible"
               :close-on-click-modal="false" @close="scrapingCancel()">
      <div>
        <el-form label-width="80px" ref="uploadScrapingForm" :inline="true">
          <el-form-item style="padding-left: 120px">
            <el-upload
              class="upload-demo"
              :action="uploadUrl"
              :headers="myHeaders"
              name="file"
              :on-error="uploadError"
              :on-success="uploadScrapingSuccess"
              :before-upload="beforeScrapingUpload"
              multiple
              drag
              :limit="1"
              :file-list="scrapingFileList">
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em><br/>只能上传xlsx文件，且不超过10M</div>
            </el-upload>
          </el-form-item>
        </el-form>
      </div>
      <div slot="footer">
        <el-button type="primary" @click="uploadScrapingFile()">确定</el-button>
        <el-button @click="scrapingCancel()">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import CustomTable from '@/components/table/CustomTable'
  import {
    apiGetDevices, apiExport, apiGetDevicesRepairList,
    apiGetFinishRepairList, apiUnRepairExport, apiUploadScrapingFile,
    apiGetFactoryBatchRepairTemplate, apiGetScrapingList
  } from '@/api/repairs/factory/index'
  import {apiFactoryBatchRepairReadExcel} from '@/api/excel/excelRead'
  import {parseTime} from '@/utils'
  import {getRoleType, getName, getFactoryId, getUserId} from '@/utils/token'
  import {baseInfo} from '@/utils/fetch'
  import store from '@/store'
  import {apiGetLogisticsCompanyList, apiGetCity} from '@/api/dictionary'
  import {downloadExcel} from "../../../utils";

  export default {
    components: {
      CustomTable
    },
    created () {
      let listQuery = {
        pageNumber: this.pagination.currentPage,
        pageSize: this.pagination.pageSize,
        isReceived: 0,
        status: 0
      }
      this.getAcceptWorkOrderList(listQuery)
      // 不是工厂操作按钮隐藏
      if (getRoleType() !== '4') {
        this.operationColumn = null
      }
      this.getAllLogisticsCompany()
      // 省份初始化
      this.getSelectProvince()
      this.roleType = getRoleType()
    },
    data () {
      return {
        scrapingFileList: [],
        preRoleType: getRoleType(),
        // 维修模板导入模态框显示
        uploadVisible: false,
        // 导入上传url
        uploadUrl: baseInfo() + '/api/v1/upload',
        // 导入上传头部
        myHeaders: {'access_token': store.getters.token},
        // 导入错误数据显示
        wrongDataList: [],
        completeWrongDataList: [],
        // 上传信息错误table显示标志量
        hideTable: false,
        // 上传文件显示
        fileList: [],
        scrapingFile: [],
        // 维修模板导入(true),维修模板导入(false)
        completeFlag: true,
        // 维修模板导入为true时显示确认按钮
        importBtnFlag: true,
        // 所有省份一览选择
        allSelectProvince: [],
        allLogisticsCompany: [],
        lastDevice: 0,
        // 当前tab
        tab: 0,
        // tab标签页
        activeName: 'unRepair',
        tableLoadingFlag: false,          // 已接收批次列表
        uploadErrorColumns: [
          {label: '错误行号', name: 'wrongRowNO', width: '100', height: '40', align: 'center'},
          {label: '错误原因', name: 'reason', width: '180', height: '40', align: 'center'},
          {label: '批次号', name: 'batch', width: '120', height: '40', align: 'center'},
          {label: '品牌', name: 'brandId', width: '120', height: '40', align: 'center'},
          {label: '型号', name: 'modelId', width: '120', height: '40', align: 'center'},
          {label: 'YSTSN', name: 'ystsn', width: '120', height: '40', align: 'center'},
          {label: '是否更新SN', name: 'isUpdate', width: '120', height: '40', align: 'center'},
          {label: '更新后的SN', name: 'updateAfterYstsn', width: '120', height: '40', align: 'center'},
          {label: '更新SN说明', name: 'updateCause', width: '120', height: '40', align: 'center'},
          {label: '责任归属', name: 'duty', width: '120', height: '40', align: 'center'},
          {label: '故障分类', name: 'faultType', width: '120', height: '40', align: 'center'},
          {label: '故障现象', name: 'faultAppearance', width: '120', height: '40', align: 'center'},
          {label: '故障处理', name: 'faultTreatment', width: '120', height: '40', align: 'center'},
          {label: '更换部件', name: 'replaceParts', width: '120', height: '40', align: 'center'},
          {label: '维修结果', name: 'repairResult', width: '120', height: '40', align: 'center'},
          {label: '原因', name: 'backReason', width: '120', height: '40', align: 'center'}
        ],
        columns: [
          {label: '返厂批次号', name: 'batch', align: 'center'},
          {label: '品牌', name: 'brandName', align: 'center'},
          {label: '型号', name: 'modelName', align: 'center'},
          {label: 'YSTSN', name: 'ystsn', align: 'center', width: '180'},
          {label: '快递单号', name: 'logisticsNumber', align: 'center'},
          {label: '快递公司', name: 'logisticsCompany', align: 'center'},
          {label: '返厂时间', name: 'backTime', align: 'center', formatter: this.formatTime},
          {label: '省份', name: 'province', align: 'center'},
          {label: '地市', name: 'city', align: 'center'},
          {label: '返厂人姓名', name: 'sender', align: 'center'},
          {label: '联系电话', name: 'tel', align: 'center'},
          // {label: '台数', name: 'num', align: 'center'},
          {label: '备注', name: 'remark', align: 'center'}
        ],
        acceptWorkOrderList: [],
        operationColumn: {
          width: '80',
          operations: [
            {name: '维修', callback: this.onBtnDetailRepair}
          ]
        },
        // 日期查询限制
        pickOption: {
          disabledDate (time) {
            return time.getTime() > Date.now()
          }
        },
        // detailTableLoadingFlag: false,    // 批次内机器详细列表
        // detailDialogVisible: false,
        // detailColumns: [
        //   {label: 'ID', name: 'id', width: '40', align: 'center'},
        //   {label: '品牌', name: 'brandName', width: '120', align: 'center'},
        //   {label: '型号', name: 'modelName', width: '120', align: 'center'},
        //   {label: 'YSTSN', name: 'ystsn', width: '200', align: 'center'}
        // ],
        // detailList: [],
        // detailOperationColumn: {
        //   width: '80',
        //   operations: [
        //     {name: '维修', callback: this.onBtnDetailRepair}
        //   ]
        // },
        pagination: this.getData(this.getAcceptWorkOrderList),
        // pagination1: this.getData(this.onBtnRepair),
        pagination1: this.getData(this.getAccepFinishtWorkOrderList),
        searchDto: {
          provinceCode: undefined,
          batch: undefined,
          logisticNumber: undefined,
          logisticsCompany: undefined,
          ystsn: undefined,
          repairTime: ''
        },
        listQuery: {
          isReceived: 0,
          batch: undefined,
          logisticsNumber: undefined,
          status: 0,
          logisticsCompany: undefined,
          repairTime: '',
          repairBeginTime: undefined,
          repairEndTime: undefined
        },
        // tab标签页
        finishTableLoadingFlag: false,
        finishColumns: [
          {label: '返厂时间', name: 'backTime', align: 'center', formatter: this.formatTime},
          {label: '返厂批次号', name: 'batch', align: 'center'},
          {label: '型号', name: 'modelName', align: 'center'},
          {label: '维修工厂', name: 'factoryName', align: 'center'},
          {label: 'YSTSN', name: 'ystsn', align: 'center', width: '180'},
          {label: '更新后的YSTSN', name: 'updateAfterYstsn', align: 'center', width: '180'},
          {label: '故障类型', name: 'faultType', align: 'center'},
          {label: '是否用料', name: 'isMaterial', align: 'center'},
          {label: '维修结果', name: 'repairResult', align: 'center'},
          {label: '维修人', name: 'repairer', align: 'center'},
          {label: '维修时间', name: 'repairTime', align: 'center'}
        ],
        accepFinishtWorkOrderList: [],
        scrapingList: [],
        scrapingColumns: [
          {label: '返厂时间', name: 'backTime', align: 'center', formatter: this.formatTime},
          {label: '返厂批次号', name: 'batch', align: 'center'},
          {label: '型号', name: 'modelName', align: 'center'},
          {label: '维修工厂', name: 'factoryName', align: 'center'},
          {label: 'SN', name: 'ystsn', align: 'center', width: '180'},
          {label: '维修人', name: 'repairer', align: 'center'}
        ],
        scrapingLoadingFlag: false,
        pagination2: this.getData(this.getScrapingList),
        scrapingOperationColumn: {
          width: '120',
          operations: [
            {name: '上传报废附件', callback: this.scrapingFile}
          ]
        },
        scrapingVisible: false,
        scrapingDto: {
          filePath: '',
          ystsn: '',
          batch: '',
          repairer: ''
        },
        selectionList: [],
        unExportLoading: false,
        finishExportLoading: false
      }
    },
    methods: {
      // 获取所有省份一览
      getSelectProvince () {
        apiGetCity().then(response => {
          this.allSelectProvince = response.data
        })
      },
      // 日期格式
      formatTime (row, column, cellValue) {
        return parseTime(cellValue)
      },
      // 获取一览信息
      getAcceptWorkOrderList (listQuery) {
        this.tableLoadingFlag = true
        if (this.listQuery.batch !== undefined) {
          listQuery.batch = this.listQuery.batch
        }
        if (this.listQuery.logisticsNumber !== undefined) {
          listQuery.logisticsNumber = this.listQuery.logisticsNumber
        }
        if (this.listQuery.logisticsCompany !== undefined) {
          listQuery.logisticsCompany = this.listQuery.logisticsCompany
        }
        if (this.listQuery.isReceived !== undefined) {
          listQuery.isReceived = this.listQuery.isReceived
        }
        if (this.listQuery.status !== undefined) {
          listQuery.status = this.listQuery.status
        }
        if (this.listQuery.provinceCode !== undefined) {
          listQuery.provinceCode = this.listQuery.provinceCode
        }
        if (this.listQuery.ystsn !== undefined) {
          listQuery.ystsn = this.listQuery.ystsn
        }
        apiGetDevicesRepairList(listQuery).then(response => {
          this.acceptWorkOrderList = response.data
          this.pagination.totalRecords = response.totalRecords
          this.tableLoadingFlag = false
        }).catch(() => {
          this.tableLoadingFlag = false
        })
      },
      // 获取已维修一览信息
      getAccepFinishtWorkOrderList (listQuery) {
        this.finishTableLoadingFlag = true
        if (this.listQuery.batch !== undefined) {
          listQuery.batch = this.listQuery.batch
        }
        if (listQuery.repairBeginTime === undefined) {
          listQuery.repairBeginTime = this.listQuery.repairBeginTime
        }
        if (listQuery.repairEndTime === undefined) {
          listQuery.repairEndTime = this.listQuery.repairEndTime
        }
        apiGetFinishRepairList(listQuery).then(response => {
          this.accepFinishtWorkOrderList = response.data
          this.pagination1.totalRecords = response.totalRecords
          this.finishTableLoadingFlag = false
        }).catch(() => {
          this.finishTableLoadingFlag = false
        })
      },
      // 获取报废中一览信息
      getScrapingList (listQuery) {
        this.scrapingLoadingFlag = true
        if (this.listQuery.batch !== undefined) {
          listQuery.batch = this.listQuery.batch
        }
        if (this.listQuery.ystsn !== undefined) {
          listQuery.ystsn = this.listQuery.ystsn
        }
        apiGetScrapingList(listQuery).then(response => {
          this.scrapingList = response.data
          this.pagination2.totalRecords = response.totalRecords
          this.scrapingLoadingFlag = false
        }).catch(() => {
          this.scrapingLoadingFlag = false
        })
      },
      excelExport () {
        this.finishExportLoading = true
        let paramsPost = {
          provinceCode: this.searchDto.provinceCode,
          ystsn: this.searchDto.ystsn,
          logisticsCompany: this.searchDto.logisticsCompany,
          logisticsNumber: this.searchDto.logisticsNumber,
          batch: this.searchDto.batch,
          roleType: getRoleType(),
          repairBeginTime: this.searchDto.repairTime === null ? '' : this.searchDto.repairTime[0],
          repairEndTime: this.searchDto.repairTime === null ? '' : this.searchDto.repairTime[1]
        }
        apiExport(paramsPost).then(response => {
          downloadExcel(response.data, '自有售后工厂已维修记录信息导出表')
          this.finishExportLoading = false
        }).catch(() => {
          console.log(err)
          this.finishExportLoading = false
        })
      },
      excelExport1 () {
        this.unExportLoading = true
        let paramsPost = {
          provinceCode: this.searchDto.provinceCode,
          ystsn: this.searchDto.ystsn,
          logisticsCompany: this.searchDto.logisticsCompany,
          logisticsNumber: this.searchDto.logisticsNumber,
          batch: this.searchDto.batch,
          roleType: getRoleType()
        }
        apiUnRepairExport(paramsPost).then(response => {
          downloadExcel(response.data, '自有售后工厂待维修记录信息导出表')
          this.unExportLoading = false
        }).catch(err => {
          console.log(err)
          this.unExportLoading = false
        })
      },
      onBtnRepair (row) {
        // 显示“返厂工单信息中的每一台机器信息”页面
        this.detailDialogVisible = true
        this.detailTableLoadingFlag = true
        if (row.batch !== null && row.batch !== '' && row.batch !== undefined) {
          this.batch = row.batch
        } else {
          row.batch = this.batch
        }
        apiGetDevices(row).then(response => {
          this.detailList = response.data
          this.pagination1.totalRecords = response.totalRecords
          if (this.detailList.length > 1) {
            this.lastDevice = 0
          } else {
            this.lastDevice = 1
          }
          this.detailTableLoadingFlag = false
        }).catch(() => {
          this.detailTableLoadingFlag = false
        })
      },
      onBtnDetailRepair (row) {
        // 跳转到维修页面
        this.$router.push({
          path: '/repairs/factory/repair',
          query: {
            model: row.modelName,
            modelId: row.modelId,
            ystsn: row.ystsn,
            brandId: row.brandId,
            batch: row.batch,
            lastDevice: 1
          }
        })
      },
      onBtnCancel () {
        this.detailTableLoadingFlag = false
        this.tableLoadingFlag = false
        this.detailDialogVisible = false
      },
      // 获取所有物流公司
      getAllLogisticsCompany () {
        apiGetLogisticsCompanyList().then(response => {
          this.allLogisticsCompany = response.data
        })
      },
      handleClick (activeName) {
        if (activeName === 'unRepair') {
          this.tab = 0
          this.searchData()
        } else if (activeName === 'alreadyRepair') {
          this.tab = 1
          this.searchData()
        } else {
          this.tab = 2
          this.searchData()
        }
      },
      onBtnAddMaterial () {
      },
      searchData () {
        this.listQuery.isReceived = 0
        this.listQuery.status = 0
        if (this.tab === 0) {
          this.listQuery.batch = this.searchDto.batch
          this.listQuery.logisticsNumber = this.searchDto.logisticsNumber
          this.listQuery.logisticsCompany = this.searchDto.logisticsCompany
          this.listQuery.provinceCode = this.searchDto.provinceCode
          this.listQuery.ystsn = this.searchDto.ystsn
          this.pagination.currentPage = 1
          this.pagination.pageSize = 10
          this.getAcceptWorkOrderList(this.listQuery)
        } else if (this.tab === 1) {
          this.listQuery.batch = this.searchDto.batch
          this.listQuery.repairBeginTime = this.searchDto.repairTime === null ? '' : this.searchDto.repairTime[0]
          this.listQuery.repairEndTime = this.searchDto.repairTime === null ? '' : this.searchDto.repairTime[1]
          this.pagination1.currentPage = 1
          this.pagination1.pageSize = 10
          this.getAccepFinishtWorkOrderList(this.listQuery)
        } else {
          this.listQuery.batch = this.searchDto.batch
          this.listQuery.ystsn = this.searchDto.ystsn
          this.pagination1.currentPage = 1
          this.pagination1.pageSize = 10
          this.getScrapingList(this.listQuery)
        }
      },
      handleCommand (command) {
        if (command === 'handleImport') {
          this.uploadVisible = true
        } else if (command === 'handleComplete') {
          this.completeBatchRepairTemplate()
        } else {
          this.completeFlag = false
        }
      },
      // 维修上传错误
      uploadError () {
        this.$message({
          showClose: true,
          message: '上传失败，请重试！'
        })
      },
      // 上传前对文件的大小的判断
      beforeAvatarUpload (file) {
        let fileNameArr = file.name.split('.')
        let extension = fileNameArr[fileNameArr.length - 1] === 'xlsx'
        let isLt2M = file.size / 1024 / 1024 < 10
        if (!extension) {
          this.$message({
            showClose: true,
            message: '上传模板只能是 xlsx 格式!'
          })
        }
        if (!isLt2M) {
          this.$message({
            showClose: true,
            message: '上传模板大小不能超过 10MB!'
          })
        }
        return extension && isLt2M
      },
      // 上传成功后的回调
      uploadSuccess (response) {
        this.message = this.$message({
          type: 'warning',
          duration: 0,
          message: '文件解析中，请勿关闭窗口!'
        })
        if (this.completeFlag) {
          let uploadDto = {
            filePath: response.data,
            repairer: getName(),
            factoryId: getFactoryId(),
            repairerId: getUserId(),
          }
          this.excelRead(uploadDto)
        }
        this.importBtnFlag = false
      },
      // 批量维修模板导入解析
      excelRead (uploadDto) {
        apiFactoryBatchRepairReadExcel(uploadDto).then(response => {
          if (response.data) {
            this.wrongDataList = response.data
            this.hideTable = true
            this.importBtnFlag = true
          } else {
            this.$message({
              showClose: true,
              message: '批量维修成功!',
              type: 'success'
            })
            this.importBtnFlag = true
            this.hideTable = false
            this.getAcceptWorkOrderList({
              pageNumber: this.pagination.currentPage,
              pageSize: this.pagination.pageSize
            })
          }
          this.fileList = []
          this.message.close()
        })
      },
      // 导入模态框关闭事件
      uploadCancel () {
        this.uploadVisible = false
        this.wrongDataList = []
        this.fileList = []
        this.hideTable = false
        this.$refs['uploadForm'].resetFields()
      },
      selectionChange (val) {
        this.selectionList = val
      },
      // 完整批量维修模板下载
      completeBatchRepairTemplate () {
        if (this.selectionList === undefined || this.selectionList.length === 0) {
          this.$message({
            showClose: true,
            message: '未选中待维修设备',
            type: 'warn'
          })
          return
        }
        let repairTemplateInfoList = []
        for (let i in this.selectionList) {
          let repairTemplateInfo = {
            batch: '',
            brand: '',
            model: '',
            ystsn: ''
          }
          repairTemplateInfo.batch = this.selectionList[i].batch
          repairTemplateInfo.brand = this.selectionList[i].brandName
          repairTemplateInfo.model = this.selectionList[i].modelName
          repairTemplateInfo.ystsn = this.selectionList[i].ystsn
          repairTemplateInfoList.push(repairTemplateInfo)
        }
        console.log(repairTemplateInfoList)
        let data = {}
        data.factoryBatchRepairTemplate = repairTemplateInfoList
        apiGetFactoryBatchRepairTemplate(data).then(response => {
          downloadExcel(response.data, '自有售后工厂批量维修模板')
        })
      },
      // 上传附件
      scrapingFile (row) {
        this.scrapingVisible = true
        this.scrapingDto.batch = row.batch
        this.scrapingDto.ystsn = row.ystsn
        this.scrapingDto.repairer = row.repairer
      },
      // 上传附件成功调用
      uploadScrapingSuccess (response) {
        this.scrapingDto.filePath = response.data
        this.$message({
          showClose: true,
          message: '上传成功',
          type: 'success'
        })
      },
      beforeScrapingUpload (file) {
        let fileNameArr = file.name.split('.')
        let extension = fileNameArr[fileNameArr.length - 1]
        let isLt2M = file.size / 1024 / 1024 < 10
        let fileType = true
        if (extension !== 'xlsx' && extension !== 'zip') {
          fileType = false
          this.$message({
            showClose: true,
            message: '上传模板只能是 xlsx 或 zip 格式!'
          })
        }
        if (!isLt2M) {
          this.$message({
            showClose: true,
            message: '上传文件大小不能超过 10MB!'
          })
        }
        return fileType && isLt2M
      },
      // 报废中补充报废附件
      uploadScrapingFile () {
        if (!this.scrapingDto.filePath) {
          this.$message({
            message: '请先上传报废附件',
            showClose: true,
            type: 'warning'
          })
        } else {
          apiUploadScrapingFile(this.scrapingDto).then(() => {
            this.$message({
              message: '添加报废附件成功，请等待审批人员审核',
              showClose: true,
              type: 'success'
            })
            this.searchData()
            this.scrapingCancel()
          }).catch(() => {
            this.scrapingCancel()
          })
        }
      },
      // 取消上传附件
      scrapingCancel () {
        this.scrapingVisible = false
        this.scrapingDto.filePath = ''
        this.scrapingDto.ystsn = ''
        this.scrapingDto.batch = ''
        this.scrapingDto.repairer = ''
        this.scrapingFileList = []
      }
    }
  }
</script>
